<template>
  <div class="app-container">
    <el-table
      v-loading="listLoading"
      :data="list"
      element-loading-text="Loading"
      fit
      highlight-current-row>
      <el-table-column
        prop="username"
        label="姓名"
        sortable
        width="180">
      </el-table-column>
      <el-table-column
        prop="time"
        label="日期"
        width="180"
        sortable>
      </el-table-column>
      <el-table-column
        prop="msg"
        label="留言"
      >
      </el-table-column>
      <el-table-column
        label="类型">
        <template slot-scope="scope">
          <el-tag size="medium" :type="scope.row.type === '1' ? 'primary' : 'success'">
            {{ scope.row.type | capitalizeType }}
          </el-tag>
        </template>
      </el-table-column>
      <el-table-column
        label="操作"
        width="180">
        <template slot-scope="scope">
          <el-button
            type="text"
            icon="el-icon-delete"
            @click="handledel(scope.$index, scope.row)">删除</el-button>
        </template>
      </el-table-column>
    </el-table>
    <div style="margin-top:15px;">
      <el-pagination
        background
        layout="prev, pager, next"
        :total="total"
        @current-change="pagenumber">
      </el-pagination>
    </div>
  </div>
</template>

<script>
  import { getindexusermsg,delindexmsg } from '@/api/wxqiandao'
  export default {
    name: "indexmsg",
    data() {
      return{
        list: null,
        listLoading: true,
        pagenum:{
          count: 1,  //当前页
          ncun: 10 //每页条数
        },
        total:0 //数据总条数
      }
    },
    filters: {
      capitalizeType(val){
        let nd;
        switch (val){
          case '1':
           nd = '安然网';
           break;
          case '2':
            nd='迷豆网';
            break;
          default:
            nd = '未知'
        }
        return nd;
      }
    },
    created() {
      this.getlist()
    },
    methods:{
      getlist(){
        getindexusermsg(this.pagenum).then(response => {
          this.list = response.data.list;
          this.total = response.data.total;
          this.listLoading = false;
        })
      },
      pagenumber(val){
        this.pagenum.count = this.pagenum.ncun * (val - 1) + 1
        this.listLoading = true;
        this.getlist()
      },
      handledel(index, row){
        delindexmsg(row.id).then(response =>{
          this.$message.success(response.msg);
          this.getlist();
        })
      }
    }
  }
</script>

<style scoped>

</style>
